<template>
  <user-card-list :user-list="userList"/>
  <van-empty v-if="!userList || userList.length<1" description="搜索结果为空" />
</template>

<script setup>
import {onMounted,ref} from "vue";
import {useRoute,useRouter} from "vue-router";
import myAxios from "../plugins/myAxios.ts";
import {Toast} from "vant";
import qs from 'qs';
import UserCardList from "../components/UserCardList.vue";


const route=useRoute();
const {tags}=route.query;

//const userList=ref([]);


onMounted(async ()=>{
  const userListData=await myAxios.get('/user/search/tags',{
    params:{
      tagNameList: tags
    },
    //序列化
    paramsSerializer: params => {
      return qs.stringify(params,{indices:false});
    }
  })
      .then(function (response){
        console.log('/user/search/tags succeed',response);
        Toast.success('请求成功');
        return response?.data;
      })
      .catch(function (error){
        console.log('/user/search/tags error',error);
        Toast.fail('请求失败');
          })
  console.log(userListData)
  if (userListData){
    userListData.forEach(user=>{
      if (user.tags){
        user.tags=JSON.parse(user.tags);
      }
    })
    userList.value = userListData ;
  }
})



const mockUser={
  id: 12,
  username: 'zhangsan',
  userAccount: 123,
  profile:'练习时长两年半，唱、跳、rap、打篮球，阿爸巴巴爸爸阿爸巴巴爸爸',
  avatarUrl: 'https://img2.baidu.com/it/u=1790834130,1952230725&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=500',
  gender: 0,
  phone: 110,
  email: '2412576321@com',
  planetCode: '11250',
  tags: ['java','emo','打工中','emo','打工中'],
  createTime: new Date(),
}
const userList=ref([mockUser]);

</script>

<style scoped>

</style>